import React, { Component } from 'react';
import { get } from 'utils/http'
import { TourWrap } from './styledIndex'

class Tour extends Component {
    state = ({
        tourList: []
    })
    async componentDidMount() {
        let result = await get({
            url: '/api/home/index/getTourRecommendList?city_id=0&version=6.0.9&referer=2'
        })
        
        this.setState({
            tourList: result.data.tour_show_list
        })
    }

    render() {
        return (
            <TourWrap>
                <div>
                    <header>巡回演出</header>
                    <span>></span>
                </div>
                <div className='item'>
                    {
                        this.state.tourList.length && (
                            this.state.tourList.slice(0,6).map( (value,index) => (
                                <figure key={index}>
                                    <img src={value.pic} alt={value.show_name}/>
                                    <figcaption>
                                        <h4>{value.show_name}</h4>
                                        <p>{value.schedular_num}场巡演</p>
                                    </figcaption>
                                </figure>
                            ) )
                        )
                    }
                </div>
            </TourWrap>
        );
    }
}

export default Tour;